<template>
  <ArmyPanelLayout class="barracksLeftTwo" title="通行记录" :rightPanel="true">
    <template v-slot:subtitle v-if="false">
      <div class="barracksLeftTwo--subtitle">
        更多 >>
      </div>
    </template>
    <div class="warehouseLeftIndex" v-if="snapArr.length">
    <!--<div class="warehouseLeftIndex" v-if="false">-->
      <el-scrollbar height="890px">
        <userinfoPanel v-for="(item, i) in snapArr" :key="item.time + i" :snapinfo="item"></userinfoPanel>
      </el-scrollbar>
    </div>
    <div v-else class="empty" style="padding-top: 25%;">
      <DataEmptyTwo></DataEmptyTwo>
    </div>
  </ArmyPanelLayout>
</template>

<script setup>
import ArmyPanelLayout from '@/views/armyScreen/comp/ArmyPanelLayout.vue'
import userinfoPanel from '@/views/armyScreen/warehouse/left/userinfoPanel.vue'
import {ElScrollbar} from 'element-plus'
import  {snapRecord} from '@/api/armyScreenApi.js'
import $bus from '@/util/bus.js'
import DataEmptyTwo from "@/components/common/DataEmptyTwo.vue";

/************/
onMounted(()=> {
  snapRecordService()
  $bus.on('reRequest', snapRecordService)
})
onBeforeUnmount(() => {
  $bus.off('reRequest', snapRecordService)
})
/************/
const snapArr = ref([])
function snapRecordService () {
  snapRecord().then(res => {
    console.log(res)
    const tempArr = res.data || []
    // snapArr.value = tempArr.concat(tempArr,tempArr,tempArr,tempArr,tempArr)
    snapArr.value = tempArr
  })
}

</script>

<style lang="scss" scoped>
.barracksLeftTwo {
  width: 437px;
  height: 960px;
  &--subtitle{
    opacity: 0.8;
    font-family: PingFangSC-Regular;
    font-size: 14px;
    color: #D8F0FF;
    letter-spacing: 0;
    font-weight: 400;
    position: relative;
    top: 3px;
  }
}
.warehouseLeftIndex{
  padding-top: 16px;
}
</style>
